<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <title>登山页面</title>
    <meta http-equiv="Content-Type" content="text/html;" charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=10" />
    <link rel="shortcut icon" type="image/x-icon" href="theme/default/images/favourite.ico" media="screen" />

	<link rel="stylesheet" type="text/css" href="theme/default/css/reset.css">
    <link rel="stylesheet" type="text/css" href="theme/default/css/index.css">	
	<script language="javascript" src="theme/javascript/jquery.js" type="text/javascript"></script>
	<script language="javascript" src="theme/javascript/S.js" type="text/javascript"></script>	
	<script type="text/javascript" src="theme/javascript/addressSelect.js"></script>
</head>
<body>

<!-- begin head-->
<div id="head">

  <!-- begin head_main-->
  <div class="wrap_980">
	 <ul id="nav">
		<li><a class='active' href=" ">首&nbsp;页</a></li>
		<li><a href=" ">赛事中心</a></li>
		<li><a href=" ">关于超级联赛</a></li>
		<li><span class='red ellipsis'>您好！罗超杰·沙特阿拉伯</span></li>
		<li><a href=" " class='mobile'>手机版</a></li>
		<li><span class='tel yellow'>40012345678</span></li>
	 </ul>
  </div>  <!-- end head_main-->
</div> <!-- end head-->


<div id="mainbody">
  <div class='leftlayout'>
     <div class='title_head'>
	  <img src='theme/default/images/temp.jpg' />
	  <p><a href='#' class='blue'>编辑个人信息</a></p>
	  <p class='align_left'>
	  luochaojie，欢迎来到超级联赛！ </br>
	  登录账号：15858298843 </br>
	  所属团队：宁波登山俱乐部
	  </p>	 
	 </div>
     <div class='title_left_wrap'><span class='icon_index'>用户中心首页</span></div>
	 <div class='title_left_wrap'>
	  <span class='icon_myMatch'>我的联赛</span>
	  <a href='#'>正在参加</a>	  
	  <a href='#'>历届赛事</a>
	 </div>
	 <div class='title_left_wrap'>
	  <span class='icon_myTeam'>我的团队</span>
	  <a href='#'>团队管理</a>	  
	  <a href='#'>寻找团队</a>
	 </div>
	 <div class='title_left_wrap'>
	  <span class='icon_myProfile'>个人中心</span>
	  <a href='#'    class='active'><i class='red'>完善</i>个人资料</a>	  
	  <a href='#'>修改密码</a>
	 </div>	 
	 <div class='wechat_pic'></div>	 
  </div>
  <div class='rightlayout'>
     <div class='title' id='tab01'><span class='tab_title'>个人资料</span><span class='tab_title tab_cur'>证明材料</span><span class='tab_title'>密码修改</span>     </div>
	

    <!-- 个人资料 begin -->
	<div class='wrap' name='tab01'>
		  <table class='grid01'>
		    <tr>
			  <td width='150' class='left'>真实姓名:</td>
			  <td><input type='text' class='grid01_input' /></td>
			</tr>
		    <tr>
			  <td  class='left'>我是:</td>
			  <td><select name="sex"  class="select1"  id="sex"><option value="">性别</option><option value="guy">帅男</option><option value="girl">靓女</option></select></td>
			</tr>	
		    <tr>
			  <td  class='left'>出生日期:</td>
			  <td>
			     <div class='select_address'><select name="month"  class="select1"  id="month"><option value="">月</option></select></div>
				 <div class='select_address'><select name="day"  class="select1"  id="day"><option value="">日</option></select></div>
				 <div class='select_address'><select name="year"  class="select1"  id="year"><option value="">年</option></select></div>
			  </td>
			</tr>			
		    <tr>
			  <td  class='left'>团队归属地:</td>
			  <td>
			     <div class='select_address'><select name="province"  class="select1"  id="province"><option value="">选择省</option></select></div>
				 <div class='select_address'><select name="province"  class="select1"  id="city"><option value="">选择市</option></select></div>
				 <div class='select_address'><select name="district"  class="select1"  id="district"><option value="">选择区</option></select></div>
			  </td>
			</tr>	
		    <tr>
			  <td  class='left'></td>
			  <td><input  id="detail_address" name="" type="text" class='grid01_input' autocomplete="off" placeholder="具体地址"/> </td>
			  <td></td>
			</tr>
		    <tr>
			  <td  class='left'>电子邮件地址:</td>
			  <td><input  id="mail" name="" type="text" class='grid01_input' autocomplete="off" placeholder="电子邮件地址"/> </td>
			  <td></td>
			</tr>
		    <tr>
			  <td  class='left'>QQ号码:</td>
			  <td><input  id="qq" name="" type="text" class='grid01_input' autocomplete="off" placeholder="QQ号码"/> </td>
			  <td></td>
			</tr>
		    <tr>
			  <td  class='left'>微信号:</td>
			  <td><input  id="wechat" name="" type="text" class='grid01_input' autocomplete="off" placeholder="微信号"/> </td>
			  <td></td>
			</tr>			
			  <td  class='left'></td>
			  <td><a class='btn_dark' title='提交'>提交</a></td>
			  <td></td>
			</tr>			
		  </table>      
	 </div>
	 <!-- 个人资料 end -->


	 <!-- 证明材料 begin -->	 
	<div class='wrap' name='tab01'>
	   <!--
	   <h4 class='article_title'>嗨~您还未入围正赛只有入围正赛的用户需要提交‘交通证明材料’，</br>以便主办方给您报销</h4> 
	   -->   
	  <table class='grid01'  cellspacing='0' cellpadding='0'>
		<tr>
		  <td class='left' ><span class='black'>进入正赛:</span></td>
		  <td>2015第三阶段徒步超级无敌登山比赛</td>			  
		</tr>
		<tr>
		  <td class='left'><span class='black'>所属团队:</span></td>
		  <td>宁波登山俱乐部</td>			  
		</tr>	
		<tr>
		  <td class='left' style='vertical-align:top'>交通证明材料:</td>
		  <td><div style='position:relative'><img class='team_logo' src='theme/default/images/test.png'/>&nbsp;&nbsp;<a class='blue'>点击上传</a>&nbsp;&nbsp;<a class='blue' id='addmore' title='点击新增一张材料'>再加一张</a><input class='file01' title='点击上传材料' type='file' /></div></td>			  
		</tr>
		<tr class='last'>
		  <td ></td>
		  <td><a class="width_200 btn_red">提交</a>	</td>			  
		</tr>
	
	  </table>	   
	 </div>
	 <!-- 证明材料 end -->	



	 <!-- 密码修改 end -->		 
	<div class='wrap' name='tab01'>
		  <table class='grid01'>
		    <tr>
			  <td width='150' class='left'>原始密码:</td>
			  <td><input type='password' class='grid01_input' /></td>
			  <td>&nbsp;<span class='red'>*请输入原始密码</span></td>
			</tr>
		    <tr>
			  <td class='left'>新密码:</td>
			  <td><input type='password' class='grid01_input' /></td>
			  <td>&nbsp;<span class='red'>*请输入新密码</span></td>			  
			</tr>
		    <tr>
			  <td class='left'>确认密码:</td>
			  <td><input type='password' class='grid01_input' /></td>
			  <td>&nbsp;<span class='red'>*请输入确认密码</span></td>			  
			</tr>			
			  <td></td>
			  <td><a class='btn_dark' title='修改'>修改</a></td>
			  <td></td>
			</tr>			
		  </table>      
	 </div>	 
	 <!-- 密码修改 end -->	
	 
  </div>

</div>



<div id="foot">
  <div class="wrap_980 border_bottom">
  <dl>
    <dt>关于我们</dt>	
    <dd><a href="">超级联赛介绍</a></dd>
  </dl>
  
  <dl>
    <dt>赛事进程(业余组)</dt>	
    <dd><a href="">资格赛</a></dd>
    <dd><a href="">正赛</a></dd>
    <dd><a href="">交通证明</a></dd>	
  </dl>  
  
  <dl>
    <dt>联系我们</dt>	
    <dd><a href="">官方微信公众订阅号</a></dd>
    <dd><a href="">新浪微博</a></dd>
    <dd><a href="">公司地址</a></dd>	
  </dl>   
  
   <div class="foot_right">
	  <a href="" class='border ellipsis' >这里是友情链接</a>
	  <a href="" class='border ellipsis' >这里是友情链接</a>
	  <a href="" class='ellipsis' >这里是友情链接</a>
	  <a href="" class='border ellipsis' >这里是友情链接</a>
	  <a href="" class='border ellipsis' >这里是友情链接</a>
	  <a href="" class='ellipsis' >这里是友情链接这里是友情链接这里是友情链接</a>	  
   </div>

 </div>
 
 <p class="wrap_980 border_top">
   COPYRIGHT© 2013 6DAO.CC ALL RIGHTS RESERCED</br>
	浙ICP备14001455号-1  企业法人营业执照 330204000172764
 </p>
 
</div> <!-- end foot-->
 
<script type='text/javascript'>


$(function(){
    var residenceAddress = new addressSelector(document.getElementById("province"),document.getElementById("city"),document.getElementById("district"));  //省市区三级联动
    
	var initBirthday = function(){
	    /* 李总，您好，我是徐迪辉，这里只是简单实现了初始化，每个月都是31天，没有判断大小月的联动，如果要细化到判断月份实现大小月的话，我再继续扩展*/
	    var month = '';
		var day = '';
		var year = '';
		for(var i = 1;i<13;i++){month+='<option value="month_' + i + '">' + i +'月</option>'};
		for(var j = 1;j<32;j++){day+='<option value="day_' + j + '">' + j +'号</option>'};
		for(var k = 2010;k>1914;k--){year+='<option value="year_' + k + '">' + k +'年</option>'};   //1915年-2010年，限制了5岁以下跟100岁以上的人群不能参加登山活动。
		$('#month').append(month);$('#day').append(day);$('#year').append(year);
	}
	
    $('a#addmore').click(function(){  //点击添加一行上传材料的tr
	   var tr = "<tr><td></td><td><div style='position:relative'><img class='team_logo' src='theme/default/images/test.png'/>&nbsp;&nbsp;<a class='blue'>点击上传</a>&nbsp;&nbsp;<a class='blue delet' title='删除'>删除</a><input class='file01'  type='file' /></div></td></tr>	"
	   $('.grid01 tr.last').before(tr);
	   $('a.delet').click(function(){
	       $(this).parents('tr').first().remove()
	   });
	});

    initBirthday(); //年月日初始化
    LeDao.initSelect($(".select1"),150); //select 初始化
	//LeDao.initTab({wrap:document.getElementById('tab01')});
	//LeDao.initTab({wrap:$('#tab01'),index:2})
	LeDao.initTab({wrap:$('#tab01')}) //初始化tab   如果要初始化第二个的话需要传入index 如：initTab({wrap:$('#tab01'),index:2})  这样的话就是初始化并激活了证明材料	
});
</script>


</body>
</html>
